@import "./Reset";

@function pxTovw($px, $baseFs: 3.75px) {
  @return ($px/$baseFs) * 1vw;
}
.warp {
  width: pxTovw(375px);
  .top {
    width: pxTovw(375px);
    height: pxTovw(50px);
    text-align: center;
    line-height: pxTovw(50px);
    font-size: pxTovw(16px);
    color: #555555;
  }
  main {
    width: pxTovw(375px);
    margin-top: pxTovw(30px);
    .logo {
      width: pxTovw(375px);
      img {
        width: 50%;
        display: block;
        margin: 0 auto;
      }
    }
    .ipt {
      // width: pxTovw(375px);
      width: pxTovw(345px);
      margin: 0 auto;
      height: pxTovw(73px);
      margin-top: pxTovw(30px);
      border-bottom: 2px solid #e9ecf0ff;
      p {
        color: #757575;
        font-size: pxTovw(14px);
        &:nth-of-type(2) {
          display: flex;
          margin-top: pxTovw(15px);
          justify-content: space-between;
          input {
            width: pxTovw(168px);
            // height: pxTovw(21px);
            line-height: pxTovw(21px);
            font-size: pxTovw(14px);
            border: none;
          }
          span {
            margin-right: pxTovw(40px);
            line-height: pxTovw(21px);
          }
        }
      }
    }
    .btn {
      width: pxTovw(345px);
      height: pxTovw(45px);
      margin: 0 auto;
      margin-top: pxTovw(35px);
      button {
        width: pxTovw(345px);
        height: pxTovw(45px);
        font-size: pxTovw(17.5px);
        color: #fff;
        letter-spacing: pxTovw(2px);
        background-color: #884e22ff;
        border: 1px solid #884e22ff;
      }
    }
    .psd {
      width: pxTovw(375px);
      height: pxTovw(50px);
      margin-top: pxTovw(30px);
      text-align: center;
      line-height: pxTovw(50px);
      font-size: pxTovw(17.5px);
      color: #555555;
      a {
        font-size: pxTovw(17.5px);
        // color: #555555;
      }
    }
    .psdd {
      width: pxTovw(345px);
      height: pxTovw(55px);
      margin: 0 auto;
      text-align: center;
      margin-top: pxTovw(20px);
      line-height: pxTovw(30px);
      font-size: pxTovw(14px);
      border-top: 1px solid #ededed;
      color: #555555;
      position: relative;
      &::after {
        position: absolute;
        content: "第三方登录";
        width: pxTovw(130px);
        height: pxTovw(25px);
        top: pxTovw(-16px);
        left: pxTovw(107px);
        background-color: #fff;
      }
    p{
        width: pxTovw(300px);
        height: pxTovw(50px );
        margin: 0 auto;
        display: flex;  
        justify-content:space-around;
        align-items: flex-end;
        span{
            display: block;
        }
    }
    }
  }
}
